<template>
  <div id="login">
          <body>

        <div class="account-pages"></div>
        <div class="clearfix"></div>
        <div class="wrapper-page">
            <div class="text-center">
                <a href="index.html" class="logo"><span>Admin<span>to</span></span></a>
                <h5 class="text-muted m-t-0 font-600">Responsive Admin Dashboard</h5>
            </div>
        	<div class="m-t-40 card-box">
                <div class="text-center">
                    <h4 class="text-uppercase font-bold m-b-0">Sign In</h4>
                </div>
                <div class="p-20">
                    <form class="form-horizontal m-t-20" action="index.html">

                        <div class="form-group">
                            <div class="col-xs-12">
                                <input class="form-control" type="text" required="" placeholder="dispalayname" v-model="displayname">
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="col-xs-12">
                                <input class="form-control" type="password" required="" placeholder="Password" v-model="password">
                            </div>
                        </div>

                        <div class="form-group ">
                            <div class="col-xs-12">
                                <div class="checkbox checkbox-custom">
                                    <input id="checkbox-signup" type="checkbox">
                                    <label for="checkbox-signup">
                                        Remember me
                                    </label>
                                </div>

                            </div>
                        </div>

                        <div class="form-group text-center m-t-30">
                            <div class="col-xs-12">
                                <button class="btn btn-custom btn-bordred btn-block waves-effect waves-light" type="button" @click="login" id='log'>登录</button>
                            </div>
                        </div>

                        <div class="form-group m-t-30 m-b-0">
                            <div class="col-sm-12">
                                <a href="page-recoverpw.html" class="text-muted"><i class="fa fa-lock m-r-5"></i> Forgot your password?</a>
                            </div>
                        </div>
                    </form>

                </div>
            </div>
            <!-- end card-box-->

            <div class="row">
                <div class="col-sm-12 text-center">
                    <p class="text-muted">Don't have an account? <a href="page-register.html" class="text-primary m-l-5"><b>Sign Up</b></a></p>
                </div>
            </div>

        </div>

	 <div style="text-align: center; position: fixed; bottom: 0; width: 100%; line-height:150%; background:rgba(255,255,255,.9); border-top: 1px solid #ddd; z-index: 11000; font-size: 12px; ">本素材由源代码设计店铺收集整理，<a style="color:#0066ff" target="_blank" href="https://shop303982252.taobao.com/">点此购买最新版</a></div>
</body>
  </div>
</template>

<script>
import axios from 'axios'
export default {
    name:'Login',
    data () {
        return {
            displayname:'',
            password:''
        }
    },
    methods: {
        login(){
			if(this.displayname==''){
				alert('请输入昵称')
				return
			}
			if(this.password==''){
				alert('请输入密码')
				return
			}
			let form= new FormData()
			form.append('displayname',this.displayname)
			form.append('password',this.password)
			axios({
				url:'http://47.97.218.145:8000/api/user/login/',
				method:'post',
				data:form,
				withCredentials: true, // 携带set_cookie
			}).then((res)=>{
				alert(res.data.message)
				if(res.data.code==200){
                    window.sessionStorage.setItem('token',res.data.token)
					this.$router.push({path:'/app/all'})
				}
			})
		}
    },
}
</script>


<style>

</style>
